<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>登录页</title>
  <link rel="stylesheet" href="./css/login.css">
  <link rel="stylesheet" href="./font/iconfont.css">
</head>
<body>
  <div class="app">
    <!-- 头部 -->
    <a href="./index.html" class="top iconfont icon-guanbi"></a>
    <!-- 中间-主体 -->
    <div class="main">
      <!-- 1-标题部分 -->
      <h1>手机号登录</h1>
      <p class="p1">未注册手机号将自动注册</p>
      <!-- 2-input[text]手机号和验证码 -->
      <form action="./index.html">
        <input type="text" placeholder="请输入手机号">
        <input type="text" placeholder="请输入验证码">
        <span class="s1">获取验证码</span>
        <!-- 3-协议 -->
        <p class="p2">
          <input type="checkbox" name="" id="">
          <span>&nbsp;已阅读并同意<a href="#">用户协议、隐私政策</a></span>
        </p>
        <!-- 4-登录按钮 -->
        <input type="submit" value="立即登录">
      </form>
    </div>
    <!-- 底部 -->
    <div class="bottom">
      <!-- 上 -->
      <div class="b1">
        <img src="./images/b-left.png" alt="">
        <h4>&emsp;其他登录方式&emsp;</h4>
        <img src="./images/b-right.png" alt="">
      </div>
      <!-- 下 -->
      <div class="b2">
        <span class="iconfont icon-weixin"></span>
        <span class="iconfont icon-QQ"></span>
        <span class="iconfont icon-geren"></span>
      </div>
    </div>

  </div>
</body>
</html>